import React,{useState} from "react";
import SwitchImg from '../../../resources/images/switchToScreenSharing.svg';
import LocalScreenSharingPreview from './LocalScreenSharingPreview';

const SwitchToScreenSharingButton = () => {
    const [isScreenSharingActive, setIsScreenSharingActive] = useState(false);
    const [screenSharingStream, setScreenSharingStream] = useState(null);
    
    const handleScreenShareToggle = async () => {
        setIsScreenSharingActive(!isScreenSharingActive);
    }
    
	return (
		<>
            <div className='video_button_container'>
                <img src={SwitchImg} onClick={handleScreenShareToggle} className='video_button_image' />
            </div>
            {
                isScreenSharingActive &&
                <LocalScreenSharingPreview stream={screenSharingStream} />
            }
        </>
	)
}

export default SwitchToScreenSharingButton;
